@import './reset';
@import './mixin';


.search_box {
   @include Type;
   height: 90px;
   display: flex;
   position: relative;

   > .search_area {
     @include CenTer;
     top: 0;
     left: 130px;
     position: relative;
     

     > .search_inp {
        height: 35px;
        position: relative;

    

        > input {
            width: 339px;
            height: 100%;
            box-sizing: border-box;
            padding-left: 30px;
            font-size: 14px;
            border-radius: 10px 0 0 10px;
            box-sizing: border-box;
            border: 3px solid orange;
         }
         >button {
            width: 97px;
            height: 100%;
            box-sizing: border-box;
            position: absolute;
            top: 0;
            left: 339px;
            border-radius: 0 10px 10px 0;
            background-color: orange;
            color: white;
            font-weight: 600;
     }

     >.fangdajing {
        display: block;
        width: 25px;
        height: 20px;
        position: absolute;
        top: 7px;
        left: 5px;
     }
   }

   > ul{
    display: flex;
    position: absolute;
    top: 68px;
    left: -5px;
    

    > a{
        display: block;
        width: 38px;
        height: 12px;
        font-size: 10px !important;
        color: #999999;
        text-align: center;
        box-sizing: border-box;
        border-right: 1px solid #999999;
    }
    >.search_fs{
        width: 70px;
    }
    >.del_border {
        border: none;
    }
   }
// 搜索历史
   .inp_history {
    
    width: 430px;
    border-left: 1px solid #f5f5f5;
    border-bottom: 1px solid #f5f5f5;
    border-right: 1px solid #f5f5f5;
    position: absolute;
    top: 62px;
    left: 3px;
    z-index: 8888;
  

    > .inp_history_none {
        display: flex;
    }

   > .inp_history_none>.inp_history_none_lef {
     width: 250px;
     height: 244px;
     position: relative;
     background-color: white;
     border-right: 1px solid lightgray;
     box-sizing: border-box;
     > span {
        display: block;
        background-color: lightgray;
        font-size: 12px;
        font-weight: lighter;
     }
     
     >.search_img {
        width: 160px;
        height: 136px;
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        margin: auto;
     }
   }

   > .inp_history_none >.inp_history_none_rig{
      flex: 1;
      background-color: white;
      > p{
        background-color: white;
        font-size: 12px;
        font-weight: lighter;
      }

      > ul {
        display: flex;
        flex-wrap: wrap;

        > li {
            box-sizing: border-box;
           padding: 3px;
           border: 1px solid lightgray;
           font-size: 10px;
           margin: 6px;
        }

        >.search_high {
            box-sizing: border-box;
            border: 1px solid orange;
            >a{
                color: orange;
            }
            
        }
      }
   }
   display: none;
 }
}
}
